<template>
	<div class="todoItem">
		<!-- 使用自定义属性传递过来的数据，
		props中变量使用类同data中的变量 -->
		<!-- 任务{{i+1}} - {{item}} <button @click="delItem(i)">X</button> -->
		<van-cell :title="`任务${i}`" :label="item">
			<template #right-icon>
				<van-icon name="close" @click="delItem(i)"></van-icon>
			</template>
		</van-cell>
	</div>
</template>

<script>
	export  default {
		//接受从父组件TooList自定义属性传递的数据，
		//属性item、i的名称一定要与自定义属性名一致
	  props:{
	    item:String,
	    i:Number,
		delItem:Function,
	  }
	}
</script>

<style>
	.todoItem{
		margin: 10px;
	}
</style>
